import React, {PureComponent} from 'react';
import {EditableTreeTable} from 'jh-lib';
import {Button, Card} from "antd";
import ComponentType from "../../Config/ComponentType";
import '../../../custom.less'
import '../../../global.less'
import TableComp from "../../TableComp";

const x = 10;
const y = 2;
const z = 1;
const gData = [];
let tempId = 1;

const generateData = (_level, _preKey, _tns) => {
    const preKey = _preKey || '0';
    const tns = _tns || gData;

    const children = [];
    for (let i = 0; i < x; i++) {
        const code = `${preKey}-${i}`;
        tns.push({title: code, key: tempId, name: code, code: code, id: tempId ++});
        if (i < y) {
            children.push(code);
        }
    }
    if (_level < 0) {
        return tns;
    }
    const level = _level - 1;
    children.forEach((code, index) => {
        tns[index].children = [];
        return generateData(level, code, tns[index].children);
    });
};
generateData(z);

const cols = [
    {
        remark: '名称',
        name: 'name',
        floatNum: '',
        sum: false,
        reg: '',
        expression: '',
        format: '',
        align: '',
        colWidth: 100,
        componentType: ComponentType.TEXT_INPUT,
    },
    {
        remark: '应用',
        name: 'app',
        floatNum: '',
        sum: false,
        reg: '',
        expression: '',
        format: '',
        align: '',
        colWidth: 100,
        componentType: ComponentType.FINDER,
        finderCode: 'USER',
        appCode: 'USER'
    },
    {
        remark: '顺序',
        name: 'order',
        floatNum: '0',
        sum: false,
        reg: '',
        expression: '',
        format: '',
        align: '',
        colWidth: 100,
        componentType: ComponentType.NUMBER_INPUT,
    }
]

export default class BaseTest extends PureComponent {

    compRef;


    setFieldInsByName(fieldName, ins, customprops) {
        this.compRef = ins;
    }

    render() {
        return (
            <>
                <Card title={'EditableTreeTable'}
                      bodyStyle={{padding: 0}}
                      extra={[
                          <Button key={'setData'} onClick={() => {
                              this.compRef.setData(gData);
                          }}>setData</Button>,
                          <Button key={'getAjaxData'} onClick={() => {
                              console.log('getAjaxData >>>', this.compRef.getAjaxData());
                          }}>getAjaxData</Button>,
                          <Button key={'getDeleted'} onClick={() => {
                              console.log('getDeleted >>>', this.compRef.getDeleted());
                          }}>getDeleted</Button>,
                      ]}
                >
                    <div
                        style={{height: 400}}>
                        <EditableTreeTable
                            style={{height: '100%'}}
                            appins={this}
                            fieldName={'treeTable'}
                            colsConf={cols}
                            tableProps={{
                                pagination: {
                                    pageSize: 15,
                                }
                            }}
                        />
                    </div>
                </Card>
            </>
        )
    }
}